<!-- 验收标准 -->
<template>
	<div class="zs-table-page-container">
		<!-- 查询条件 -->
		<div class="zs-card-sm zs-space-bottom zs-layout-flex-row zs-layout-justify-between">
			<span>
				<el-input v-model="queryParams.inventoryName" disabled class="zs-select-md zs-space-right-sm" placeholder="清单名称" />
				<el-input v-model="queryParams.facilityName" disabled class="zs-select-md zs-space-right-sm" placeholder="设施名称" />
				<el-input v-model="queryParams.standard" class="zs-select-md zs-space-right-sm" placeholder="验收内容" clearable @blur="queryList" />
				<el-popover popper-class="zs-popper" placement="bottom-end" trigger="click">
					<template #reference>
						<el-button class="zs-btn-square-solid" :class="{ 'zs-btn-square-solid-active': queryParams.effectiveState || queryParams.auditStatus }">
							<el-icon>
								<MoreFilled />
							</el-icon>
						</el-button>
					</template>
					<template #default>
						<el-select placeholder="生效状态" v-model="queryParams.effectiveState" class="zs-select-md zs-space-right-sm" @change="queryList" :teleported="false">
							<el-option v-for="item in dictObj.VALIDATE_FLAG" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue" />
						</el-select>
						<el-select placeholder="审核状态" v-model="queryParams.auditStatus" class="zs-select-md zs-space-right-sm" @change="queryList" :teleported="false" clearable>
							<el-option v-for="item in dictObj.AUDIT_STATUS" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue" />
						</el-select>
					</template>
				</el-popover>
				<el-button class="zs-btn-plain" @click="queryList" v-btnPermi="{ permis: ['p_btn_property_project_facility_acceptance_standard_list_query'] }"> 查询 </el-button>
			</span>
			<span>
				<el-button class="zs-btn-md zs-btn-primary" :disabled="route.query.pageType == 'edit' ? false : true" @click="openBaseDrawer(false, 'add')" v-btnPermi="{ permis: ['p_btn_property_project_facility_acceptance_standard_list_add'], businessFlag: true }">新增</el-button>
			</span>
		</div>

		<!-- teble -->
		<div class="zs-card zs-table-page-content">
			<hsPageTable :loading="tableData.loading" :total="tableData.total" :tableData="tableData.data" :cloumns="tableData.cloumns" @pageChange="pageChange">
				<template #column>
					<el-table-column label="定义" width="120" align="center">
						<template #default="{ row }">
							<el-button class="zs-link" link size="small" @click="openBaseDrawer(true, 'info', row)" v-btnPermi="{ permis: ['p_btn_property_project_facility_acceptance_standard_list_view'] }">查看</el-button>
							<el-divider direction="vertical" />
							<el-button class="zs-link" link size="small" @click="openBaseDrawer(false, 'edit', row)" v-btnPermi="{ permis: ['p_btn_property_project_facility_acceptance_standard_list_edit'], businessFlag: true }">编辑</el-button>
						</template>
					</el-table-column>
					<el-table-column label="操作" width="120" align="center">
						<template #default="{ row }">
							<el-button class="zs-link" link size="small" @click="openDeleteDrawer(row)" v-btnPermi="{ permis: ['p_btn_property_project_facility_acceptance_standard_list_delete'], businessFlag: true }">删除</el-button>
						</template>
					</el-table-column>
				</template>
			</hsPageTable>
		</div>
	</div>

	<!-- 验收标准信息 -->
	<DrawerStandrad ref="standradRef" :isShow="isShowDrawer" :isReadOnly="isReadOnly" :handleType="handleType" :currentRow="currentRow.data" @close="closeBaseDrawer"> </DrawerStandrad>

	<!-- 删除确认 -->
	<hsDeleteDrawer v-if="deleteDrawer.isShow" :isShow="deleteDrawer.isShow" @close="closeDeleteDrawer"> </hsDeleteDrawer>
</template>

<script setup>
	import DrawerStandrad from './components/drawerStandrad.vue';
	import { facilityInfoApi, standardListApi, standardDeleteApi } from '@/api/facility.js';
	import { ref, reactive } from 'vue';
	import { useStore } from 'vuex';
	import { useRoute } from 'vue-router';

	const route = useRoute();
	let store = useStore();
	const curPageSize = ref(store.state.uiPageSizeDefault);

	let dictObj = store.getters.getDictObj(['VALIDATE_FLAG', 'AUDIT_STATUS']);
	let effectDict = {};
	dictObj.VALIDATE_FLAG.forEach(el => {
		effectDict[el.dictValue] = el;
	});
	let auditDictObj = {};
	dictObj.AUDIT_STATUS.forEach(ele => {
		auditDictObj[ele.dictValue] = ele;
	});

	// 列表 filed
	let tableData = reactive({
		total: 0,
		loading: false,
		data: [],
		cloumns: [
			{ prop: 'standard', label: '验收内容', align: 'left' },
			{
				prop: 'standardCost',
				label: '扣罚标准',
				align: 'right',
				width: '120',
				type: 'html',
				render: ({ row }) => {
					return <span title={row.standardCost}>{row.standardCost ? row.standardCost.toFixed(2) : row.standardCost == 0 ? '0.00' : '-'}</span>;
				},
			},
			{ prop: 'unitName', label: '单位', width: '120' },
			{
				prop: 'effectiveState',
				label: '生效状态',
				type: 'dict',
				width: '120',
				currentDict: effectDict,
				isHaveClass: true,
				currentClass: row => {
					return {
						'zs-validata-status-yes': row['effectiveState'] == 1,
						'zs-validata-status-no': row['effectiveState'] == 0,
					};
				},
			},
			{
				prop: 'auditStatus',
				label: '审核状态',
				type: 'dict',
				width: '120',
				currentDict: auditDictObj,
				isHaveClass: true,
				currentClass: row => {
					return {
						'zs-approval-status-wait': row['auditStatus'] == 0,
						'zs-approval-status-yes': row['auditStatus'] == 1,
						'zs-approval-status-no': row['auditStatus'] == 9,
					};
				},
			},
		],
	});

	//查询条件
	let queryParams = reactive({ facilityId: route.query.eid, pageNumber: 1, pageSize: curPageSize.value, effectiveState: '1', auditStatus: '', standard: '' });

	//基本信息下抽屉相关
	let handleType = ref('');
	let isReadOnly = ref(false);
	let standradRef = ref();
	let isShowDrawer = ref(false);
	let currentRow = reactive({ data: {} });

	const openBaseDrawer = (flag, type, row) => {
		isReadOnly.value = flag;
		currentRow.data = row;
		isShowDrawer.value = true;
		handleType.value = type;
	};

	const closeBaseDrawer = data => {
		isShowDrawer.value = data.isShow;
		data.isRefresh && queryList('init');
	};

	const openDeleteDrawer = row => {
		deleteDrawer.isShow = true;
		deleteDrawer.deleteId = row.id;
	};

	//删除
	let deleteDrawer = reactive({
		isShow: false,
		deleteId: '',
	});

	const closeDeleteDrawer = async data => {
		deleteDrawer.isShow = data.isShow;
		if (data.isDelete) {
			let res = await standardDeleteApi(deleteDrawer.deleteId);
			if (res.data.code !== 200) return;
			queryList('init');
		}
	};

	// 列表数据源
	const queryList = async init => {
		if (process.env.NODE_ENV !== 'development') {
			let portalResourceList = JSON.parse(localStorage.getItem('portalResourceList'));
			if (init != 'init' && !portalResourceList.includes('p_btn_property_project_facility_acceptance_standard_list_query')) return;
		}
		tableData.loading = true;
		let res = await standardListApi(queryParams);
		if (res.data.code !== 200) return;
		tableData.data = res.data.data.list || [];
		tableData.total = res.data.data.total || 0;
		tableData.loading = false;
	};

	// 分页
	const pageChange = page => {
		queryParams.page = page.current;
		queryParams.pageSize = page.pageSize;
		queryList('init');
	};

	//设施详情 eid:设施id
	const getBaseInfo = async () => {
		if (!route.query.eid) return;
		let res = await facilityInfoApi(route.query.eid);
		if (res.data.code !== 200) return;
		queryParams.inventoryName = res.data.data.inventoryName;
		queryParams.facilityName = res.data.data.facilityName;
	};

	getBaseInfo();
	queryList('init');
</script>
